<script setup>
import useHomeStore from '@/store/home'
import {storeToRefs} from 'pinia'
import HomeCard from '@/views/main/home/cpn/home-card/home-card.vue'

const homeStore = useHomeStore()
homeStore.fetchCountListAction()
const {countList, isLoading} = storeToRefs(homeStore)
</script>

<template>
  <div class="home" v-if="!isLoading">
    <template v-for="item in countList" :key="item.title">
      <home-card v-bind="item"/>
    </template>
  </div>
</template>

<style lang="scss" scoped>
.home {
  @include grid-box;
  grid-template-columns: repeat(3, 1fr);
  gap: $spacing-2;
}
</style>
